<div class="layui-fluid nepadmin-pad0 nepadmin-mar0" id="VIEW-detail-plan" lay-title="工作计划">
    <div class="layui-card" style="margin-bottom: 0;">
        <div class="layui-card-body nepadmin-pad30">
            <h2 class="nepadmin-pad-b10">日历平铺展示内容</h2>
            <p class="nepadmin-c-gray">可以展示一些工作计划、日程等内容。</p>
        </div>
    </div>
    <div class="layui-row layui-col-space10 nepadmin-pad20">
        <div class="layui-col-md12 layui-bg-white">
            <div class="custom-full-date nepadmin-laydate-full"></div>
        </div>
    </div>
</div>
<style>
    #VIEW-detail-plan .custom-full-date td.layui-this .customdate-content {
        color: #5a8bff;
    }

    #VIEW-detail-plan .customdate-content {
        line-height: 18px;
        font-size: 12px;
        color: #f25657;
    }

    #VIEW-detail-plan .customdate-content h2 {
        font-size: 24px;
        margin-bottom: 8px;
    }
</style>
<script>
    layui.use(['laydate', 'jquery','inputTags','admin'], function (laydate) {
        var $ = layui.jquery;
        var inputTags = layui.inputTags;
        var admin = layui.admin;
        var viewCls = '#VIEW-detail-plan';

        var markList = {};
        admin.get({
            type: 'get',
            url: '/sysSchedule/list',
            dataType: 'json',
            async:false,
            success: function(res){
                if (res.code == 0){
                    markList = res.maps;
                } else {
                    layer.msg(res.msg);
                }
            }
        });

        laydate.render({
            elem: viewCls + ' .custom-full-date',
            position: 'static',
            showBottom: false,
            ready: customContent,
            change: customContent,
            done: function(value, date) {
                // console.log($(this).find('.customdate-content').attr("data-value"))
                var data = date.year+'-'+date.month+'-'+date.date;
                dateChose(data);
            }
        });
        function customContent() {
            $(this.elem).find('[lay-ymd]').each(function () {
                var ymd = $(this).attr('lay-ymd');
                var day = ymd.split('-')[2];
                var mark = markList[ymd];
                if (mark) {
                    var p = $('<div class="customdate-content" data-value="'+mark+'"><h2>' + day + '</h2>' + mark.join('<br/>') + '</div>');
                    $(this).html(p);
                }
            })
        }

        function dateChose(value){
            var index = layer.open({
                type: 1,
                title:'添加记录',
                area: ['400px', 'auto'], //宽高
                btn:['确定','取消'],
                content: '<div style="height: 145px;padding: 15px !important;">'+
                '<form class="layui-form" action="">'+
                '<div class="layui-form-item layui-form-text" >'+
                ' <div class="tags" id="tags" >'+
                ' <input type="text" id="keywords" name="keywords" autocomplete="off" placeholder="请输入关键字" class="layui-input">'+
                ' </div>'+
                '</div>'+
                '</form>'+
                '</div>'
                ,success:function(){
                    // 标签,获取值
                    var data = markList[value];
                    $("#name").val(data);
                    inputTags.render({
                        elem:'#keywords',
                        content: data,
                        aldaBtn: true,
                        done: function(value){
                            console.log(value)
                        }
                    })
                }
                ,yes:function (){
                    //调用添加/编辑标注方法
                    var sysSchedule = {};
                    sysSchedule.day = value;
                    var titleArr=[];
                    $("#tags span em").each(function(){
                        var keyword = $(this).html();
                        titleArr.push(keyword);
                    });
                    sysSchedule.title = titleArr.join(",");
                    admin.post({
                        url:"/sysSchedule/save",
                        contentType: "application/json",
                        data:JSON.stringify(sysSchedule),
                        success:function(res){
                            if (res.code == 0){
                                // 提醒保存成功，关闭当前弹窗
                                // loadSchedule();
                                var day = value.split('-')[2];
                                var p = $('<div class="customdate-content" data-value="'+titleArr+'"><h2>' + day + '</h2>' + titleArr.join('<br/>') + '</div>');
                                $(viewCls + ' .custom-full-date').find("[lay-ymd="+value+"]").html(p);
                                layer.msg(res.msg);
                                layer.closeAll();
                            } else {
                                layer.msg(res.msg);
                            }
                        }
                    });
                }
                ,btn2: function(index, layero){
                    // 清除值
                    var val = $(viewCls + ' .custom-full-date').find("[lay-ymd="+value+"] .customdate-content").attr("data-value");
                    if(val){
                        markList[value] = val.split(",");
                    }
                }
            });
        }
    })
</script>